import 'package:flutter/material.dart';

class ButtonPage extends StatefulWidget {
  @override
  _ButtonPageState createState() => _ButtonPageState();
}

String buttonText = "";
double _volume = 0;

class _ButtonPageState extends State<ButtonPage> {

  void navigateNamed(String routeName){
    Navigator.pushNamed(context, routeName);
  }

// class ButtonPage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('按钮'),
        elevation: 0.0,
      ),
      body: Column(
        children: <Widget>[
          Text('Button Pressed : $buttonText, $_volume'),
          RaisedButton(
            onPressed: () {
              setState(() {
                buttonText = "RaisedButton";
              });
            },
            child: Text(
              'RaisedButton',
              style: TextStyle(fontSize: 16)
            ),
            textColor: Colors.white,
            color: Colors.lightBlue,
          ),
          MaterialButton(
            onPressed: () {
              setState(() {
                buttonText = "RaisedButton";
              });
            },
            child: Text(
              'RaisedButton',
              style: TextStyle(fontSize: 16)
            ),
            textColor: Colors.white,
            color: Colors.lightBlue,
            minWidth: double.infinity,
          ),
          Container(
            width: double.infinity,
            height: 50,
            padding: EdgeInsets.only(left: 20,right: 20),
            child: RaisedButton(
              onPressed: () {},
              child: Text("宽度占满了"),
              color: Colors.green,
              textColor: Colors.white,
            ),
          ),
          FlatButton(
            color: Colors.blue,
            textColor: Colors.white,
            disabledColor: Colors.grey,
            disabledTextColor: Colors.black,
            padding: EdgeInsets.all(8.0),
            splashColor: Colors.blueAccent,
            onPressed: () {
              setState(() {
                buttonText = "FlatButton";
              });
            },
            child: Text(
              "Flat Button",
              style: TextStyle(fontSize: 20.0),
            ),
          ),
          IconButton(
              icon: Icon(Icons.volume_up),
              tooltip: 'Increase volume by 10',
              onPressed: () {
                setState(() {
                  _volume += 10;
                });
              },
            ),
          FlatButton.icon(
            color: Colors.blue,
            textColor: Colors.white,
            disabledColor: Colors.grey,
            disabledTextColor: Colors.black,
            padding: EdgeInsets.all(8.0),
            splashColor: Colors.blueAccent,
            onPressed: () {
              setState(() {
                buttonText = "FlatButton";
              });
            },
            icon: Icon(Icons.ac_unit),
            label: Text('aaa'),
          ),
          FlatButton(
            color: Colors.transparent,
            textColor: Colors.lightBlue,
            disabledColor: Colors.grey,
            disabledTextColor: Colors.black,
            padding: EdgeInsets.all(8.0),
            splashColor: Colors.transparent,
            onPressed: () {
              setState(() {
                buttonText = "FlatButton";
              });
            },
            child: Text(
              "Flat Button",
              style: TextStyle(fontSize: 20.0),
            ),
          ),
        ],
      ),  
    );
  }
  
}